El componente de compras es la pantalla, el componente principal que representa el artículo del carrito, y solo paso los artículos del carrito al componente de la lista del carrito que muestra mi artículo en un formato determinado.

Pero cada vez que llamo a la función de agregar en el componente CartList y dejo la página, parece que ya no muestra los elementos del carrito y se congela.

¿Hay alguna manera de arreglar este problema?

 export default class ShoppingCartScreen extends Component { constructor(props) { super(props) this.state = { uid: Fire.shared.uid, cartList: [], loading: true } } render() { switch (this.state.loading) { case false: return ( { this.state.cartList.length > 0 ? <ScrollView backgroundColor='#bbb'> {this.state.cartList.map((c) => ( <CartList name={c.item} price={c.price} qty={c.qty} image={c.image} navigation{this.props.navigation}/> ))} </ScrollView> default: return <View style={styles.loading} > <ActivityIndicator size='large' color='#303233' /> </View> } } } export default class CartList extends Component { constructor(props) { super(props) this.state = { name: this.props.name, image: this.props.image, qty: this.props.qty, price: this.props.price, cartId: '', found: false } } remove = (qty, name, p, img) => { let q = qty if (q > 1) { let q = qty q -= 1; const x = { image: img, item: name, price: p, qty: q, } if (this.state.found) { Fire.shared .firestore .collection('cart') .doc(this.state.cartId) .update({ items: x }) this.setState({ qty: q }) } }